<script>
  $(document).ready(function(){
    <?php 
    $a  = 1;
    $s  = 1;
    
    $cr = 1;
    $re = 1;
    $up = 1;
    $de = 1;

    $crea = 1;
    $read = 1;
    $upda = 1;
    $dele = 1;

    foreach ($roles as $role_js):
    ?>
    $('#roles<?php echo $a++;?>').click(function(){
        if($('#roles<?php echo $s++;?>').is(":checked")){

          $('#c<?php echo $cr++;?>').prop('checked', true).prop('disabled', false);
          $('#r<?php echo $re++;?>').prop('checked', true).prop('disabled', false);
          $('#u<?php echo $up++;?>').prop('checked', true).prop('disabled', false);
          $('#d<?php echo $de++;?>').prop('checked', true).prop('disabled', false);

        }else{

          $('#c<?php echo $crea++;?>').prop('checked', false).prop('disabled', true);
          $('#r<?php echo $read++;?>').prop('checked', false).prop('disabled', true);
          $('#u<?php echo $upda++;?>').prop('checked', false).prop('disabled', true);
          $('#d<?php echo $dele++;?>').prop('checked', false).prop('disabled', true);

        }
    });
    <?php endforeach;?>
  });
</script>

    <div class="container">
      <div class="bg-putih">

        <div class="jdl-page">
          <?php echo isset($judul)?$judul:'<font color="#ccc">Judul Belum Diberikan</font>'; ?>
          <div class="clearfix"></div>
        </div>
        
        <?php echo display_flash(); ?>
        
        <?php echo form_open('auth/create_group', array('class' => 'form-horizontal', 'role' => 'form', 'id' => 'form')); ?>
          <input type="hidden" name="jml" value="<?php echo count($roles); ?>">
          <div class="form-group">
            <label class="col-xs-3">Nama Grup</label>
            <div class="col-xs-4">
              <?php echo form_input($group_name);?>
            </div>
          </div>
          <div class="form-group">
            <label class="col-xs-3">Deskripsi</label>
            <div class="col-xs-7">
              <?php echo form_input($description);?>
            </div>
          </div>
          <div class="form-group">
            <label class="col-xs-3">Role yang diizinkan</label>
            <label class="col-xs-9">Akses yang diberkan</label>
          </div>
          <div class="form-group" style='-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;-o-user-select:none;' unselectable='on' onselectstart='return false;' onmousedown='return false;'>
            <?php 
            $i=1;
            $x=1;
            $m=1;
            
            $c=1;
            $r=1;
            $u=1;
            $d=1;

            $cre=1;
            $rea=1;
            $upd=1;
            $del=1;

            $m1=1;
            $m2=1;
            $m3=1;
            $m4=1;
            foreach ($roles as $roles):
            ?>
              <div class="col-xs-3">
                <div class="checkbox checkbox-inline checkbox-primary">
                  <input type="checkbox" class="styled" name="roles<?php echo $i++; ?>" id="roles<?php echo $x++; ?>" value="<?php echo $roles['id'];?>">
                  <label for="roles<?php echo $m++; ?>"> <?php echo $roles['name'];?></label>
                </div>
              </div>

              <div class="col-xs-9">
                <div class="checkbox checkbox-inline checkbox-success" style="margin-right:70px;">
                  <input type="checkbox" class="styled" name="c<?php echo $c++; ?>" id="c<?php echo $cre++; ?>" disabled>
                  <label for="c<?php echo $m1++; ?>" style="font-family:open_sansregular, arial;"> Create</label>
                </div>
                <div class="checkbox checkbox-inline checkbox-info" style="margin-right:70px;">
                  <input type="checkbox" class="styled" name="r<?php echo $r++; ?>" id="r<?php echo $rea++; ?>" disabled>
                  <label for="r<?php echo $m2++; ?>" style="font-family:open_sansregular, arial;"> Read</label>
                </div>
                <div class="checkbox checkbox-inline checkbox-warning" style="margin-right:70px;">
                  <input type="checkbox" class="styled" name="u<?php echo $u++; ?>" id="u<?php echo $upd++; ?>" disabled>
                  <label for="u<?php echo $m3++; ?>" style="font-family:open_sansregular, arial;"> Update</label>
                </div>
                <div class="checkbox checkbox-inline checkbox-danger" style="margin-right:70px;">
                  <input type="checkbox" class="styled" name="d<?php echo $d++; ?>" id="d<?php echo $del++; ?>" disabled>
                  <label for="d<?php echo $m4++; ?>" style="font-family:open_sansregular, arial;"> Delete</label>
                </div>
              </div>
            <?php 
            endforeach;
            ?>
          </div>

          <div class="form-group">
            <div class="col-xs-12">
              <button type="submit" class="btn btn-primary btn-sm">Buat Grup</button>
              <button type="reset" class="btn btn-default btn-sm">Kosongkan</button>
            </div>
          </div>
        <?php echo form_close(); ?>

        <div class="clearfix"></div>
      </div>
    </div> <!-- /container -->